<template>
  <div class="state">
    <!-- 左侧大框 -->
    <div class="s-left">
      <div class="content">
        <div class="base">
          <slot name="base"></slot>
        </div>
        <!-- 定位 -->
        <div class="secret flex" v-show="Data.label">
          <span v-for="(item, index) in Data.label" :key="index">{{
              item
            }}</span>
        </div>
        <!-- 进入画像 -->
<!--        <div class="enter" v-show="Data.showEnter" @click="handleIn">进入画像</div>-->
      </div>
    </div>
    <!-- 右侧2按钮 -->
<!--    <div class="s-right">
      &lt;!&ndash;      <img src="@/assets/images/judge/up.png" alt="" />&ndash;&gt;
      &lt;!&ndash;      <img src="@/assets/images/judge/down.png" alt="" />&ndash;&gt;
      <i class="el-icon-arrow-up"></i>
      <i class="el-icon-arrow-down"></i>
    </div>-->
  </div>
</template>

<script>
export default {
  props: {
    Data: {
      type: Object,
      default: {}
    }
  },
  methods: {
    handleIn() {
      window.open('http://192.168.1.211:8081/index/userBehavior')
    }
  }
}
</script>

<style lang="scss" scoped>
.state {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;

  .s-left {
    width: 100%;
    padding: 10px;
    //background: url(../../../assets/images/judge/bbox.png) no-repeat 0 0;
    //background-size: 100% 100%;
    //background:#fff;
    .content {
      position: relative;
      width: 100%;
      height: 100%;

      .base {
        height: 100%;
        text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
      }

      .secret {
        position: absolute;
        right: 0;
        top: 0;

        > span {
          padding: 3px 10px;
          color: #3b8bff;
          background: rgba(59, 139, 255, 0.2);
          border: 1px solid rgba(59, 139, 255, 1);
          border-radius: 4px;
          margin-left: 10px;
        }
      }

      .enter {
        position: absolute;
        right: 0;
        bottom: 0;
        color: #3b8bff;
      }
    }
  }

  .s-right {
    display: flex;
    flex-direction: column;

    i {
      display: inline-block;
      padding: 6px;
      font-size: 16px;
      background: #fff;
      margin-bottom: 5px;
      border: 4px;
      color: #00afff;
      cursor: pointer;
    }
  }
}
</style>
